<!doctype html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>搜索-ylbNotesHub</title>
    <link rel="stylesheet" th:href="@{/bootstrap/css/bootstrap.min.css}">
    <link rel="stylesheet" th:href="@{/layui/css/layui.css}">
    <link rel="stylesheet" th:href="@{/css/mycss.css}">
    <link rel="stylesheet" href="//at.alicdn.com/t/font_2080705_x7u3h1yrrfc.css">
    <style>
        #table-title tr th {
            border: none;
        }
    </style>
</head>
<body>

<div th:replace="~{common/header::header(activeUrl='search')}"></div>

<main role="main" class="container">
    <div class="row">

        <div class="col-md-9 blog-main">

            <!--&lt;!&ndash;加载动画&ndash;&gt;-->
            <div id="loadd">
                <div><i class="layui-icon layui-icon-loading layui-anim layui-anim-rotate layui-anim-loop"
                        style="font-size: 50px;color: #007bff;"></i></div>
            </div>

            <div class="my-3 p-3 bg-white rounded shadow-sm">
                <div id="blog" th:fragment="blog">
                    <!--如果没有文章-->
                    <div th:if="${blogs.getDatas().size()<=0}">
                        <h4 th:text="${msg}"></h4>
                        <hr class="layui-bg-blue">
                        <div class="media text-muted pt-3">~~这个博客太臭了，什么都没有~~ &emsp;&emsp;
                        </div>
                    </div>
                    <!--如果有文章-->
                    <div th:if="${blogs.getDatas().size()>0}" id="highler">

                        <hr class="layui-bg-blue">
                        <div th:each="blog:${blogs.getDatas()}" class="media text-muted pt-3" >

                            <p
                               class="media-body pb-3 mb-0 small lh-125 border-bottom border-gray"
                               style="margin-left: 5px;overflow: hidden;text-overflow: ellipsis;">

                                <!-- 标题 -->
                                <span class="titlecolor" th:text="${blog.getTitle()}" hidden="hidden"></span>
                                <a style="font-size: 14px"
                                   th:href="@{'/article/read/'+${blog.getBid()}+'/'+${blog.getAuthorId()}}"
                                   class="showtitlecolor text-dark font-weight-bold text-decoration-none d-block" target="_blank">
                                </a>

                                <!--内容摘要-->
                                <span class="contcolor" th:text="${#strings.abbreviate(blog.getContent(),100)}" hidden="hidden"></span>
                                <span  class="badge u-content-zy showcontcolor"></span>

                                <br>
                                <!-- 时间 -->
                                <span th:text="${#dates.format(blog.getUpdateTime(),'yyyy-MM-dd HH:mm:ss')}"
                                      class="badge badge-light u-content-tab">
                            </span>&emsp;
                                <!-- 浏览量 -->
                                <span><i class="iconfont icon-liulan" style="font-size: 13px;"></i>
                                [[${blog.getViews()}]]
                            </span>&emsp;
                            </p>
                        </div>

                        <!--分页-->
                        <nav aria-label="Page navigation example" class="mt-4">
                            <ul class="pagination justify-content-center pagination-sm">
                                <li th:class="${blogs.getPageInfo().isHasPreviousPage()==true?'page-item':'page-item disabled'}">
                                    <a class="page-link"
                                       th:href="@{'/search/'+${blogs.getPageInfo().pageNum -1}+'/20?title='+${key}}"
                                       tabindex=""><&nbsp;</a>
                                </li>
                                <li class="page-item" th:if="${blogs.getPageInfo().isHasPreviousPage()}">
                                    <a class="page-link"
                                       th:href="@{'/search/'+${blogs.getPageInfo().pageNum -1}+'/20?title='+${key}}"
                                       th:text="${blogs.getPageInfo().pageNum -1}"></a>
                                </li>
                                <li class="page-item active">
                                    <a class="page-link"
                                       th:href="@{'/search/'+${blogs.getPageInfo().pageNum}+'/20?title='+${key}}"
                                       th:text="${blogs.getPageInfo().pageNum}"></a>
                                </li>
                                <li class="page-item" th:if="${blogs.getPageInfo().isHasNextPage()}">
                                    <a class="page-link"
                                       th:href="@{'/search/'+${blogs.getPageInfo().pageNum +1}+'/20?title='+${key}}"
                                       th:text="${blogs.getPageInfo().pageNum +1}"></a>
                                </li>
                                <li th:class="${blogs.getPageInfo().isHasNextPage()==true?'page-item':'page-item disabled'}">
                                    <a class="page-link"
                                       th:href="@{'/search/'+${blogs.getPageInfo().pageNum +1}+'/20?title='+${key}}">&nbsp;></a>
                                </li>
                            </ul>
                        </nav>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <hr class="layui-bg-blue">
</main>

<div th:replace="~{common/footer::footer}"></div>

<a class="to-top"><i class="iconfont icon-fanhuidingbu1" style="font-size:50px;color: #007bff"></i></a>
<script th:src="@{/js/jquery-3.5.1.min.js}"></script>
<script th:src="@{/bootstrap/js/bootstrap.bundle.min.js}"></script>
<script th:src="@{/js/toTop.js}"></script>
<script th:src="@{/layui/layui.all.js}"></script>
<script th:src="@{/js/daohang.js}"></script>
<script th:src="@{/js/high.js}"></script>
<script type="text/javascript"  th:inline="javascript">
        high([[${key}]]);

</script>
</body>
</html>